<template>
  <div class="layout">
    <div>
      <BackNav left-text="返回" left-arrow title="新增地址"></BackNav>
    </div>
    <van-address-edit
      :area-list="areaList"
      save-button-text="保存地址"
      show-postal
      show-set-default
      show-search-result
      :search-result="searchResult"
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      @change-detail="onChangeDetail"
    />
  </div>
</template>
<script>
import BackNav from "../components/BackNav";
import { areaList } from "../../node_modules/@vant/area-data";
export default {
  components: {
    BackNav,
  },
  data() {
    return {
      areaList,
      searchResult: [],
      addresslist: [],
    };
  },
  methods: {
    onSave(value) {
      
      this.axios({
        method: "post",
        url: "/addAddress",
        data: {
          name: value.name,
          tel: value.tel,
          province: value.province,
          city: value.city,
          county: value.county,
          addressDetail: value.addressDetail,
          areaCode: value.areaCode,
          postalCode: value.postalCode,
          isDefault: value.isDefault ? 1 : 0,
        },
      })
        .then((res) => {
          
          if (res.data.code == 9000) {
            this.$toast("保存成功");
            this.addresslist.push(value);
            setTimeout(() => {
              this.$router.go(-1)
            }, 500);
          }
        })
        .catch((err) => {
          
        });
    },
    onChangeDetail(val) {
      if (val) {
        this.searchResult = [
          {
            address: "珠吉路",
          },
        ];
      } else {
        this.searchResult = [];
      }
    },
  },
};
</script>
<style lang="less" scoped>
/deep/ .van-button--danger {
  background: #0c43ba;
  border-color: #0c43ba;
}
.layout {
  background: #f0f0f0;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  .main {
    padding: 10px;
    .wrapper {
      background: #fff;
      padding: 10px;
    }
  }
}
</style>